<template>
    <div class="studentManage">
        <el-breadcrumb separator="/" class="breadcrumb-bottom">
            <el-breadcrumb-item :to="{ path: '/' }">系统管理</el-breadcrumb-item>
            <el-breadcrumb-item>学生管理</el-breadcrumb-item>
        </el-breadcrumb>
        <el-form :model="studentManageForm" :rules="rules" ref="studentManageForm" label-width="0px">
            <el-row :gutter="20">
                <el-col :span="6">
                     <el-form-item prop="">
                        <el-select v-model="studentManageForm.region" placeholder="请选择专业">
                            <el-option label="计算机科学与技术" value="1"></el-option>
                            <el-option label="软件工程" value="2"></el-option>
                            <el-option label="网络工程" value="3"></el-option>
                            <el-option label="物联网" value="4"></el-option>
                        </el-select>
                     </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-form-item prop="">
                    <el-input v-model="studentManageForm.year" placeholder="请输入入学年份"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="2" class="overflow-clear">
                    <el-button type="primary" @click="submitForm('studentManageForm')" class="float-right">立即搜索</el-button>
                </el-col>
            </el-row>
        </el-form>
        <hr/>
        <div>
            <el-button-group style="margin-bottom:4px;" class="float-right">
            <el-button type="primary">删除学生信息</el-button>
            <el-button type="primary">修改学生状态</el-button>
            </el-button-group>
        </div>
        <el-table
            :data="tableData3"
            border
            tooltip-effect="dark"
            style="width: 100%"
            @selection-change="handleSelectionChange">
            <el-table-column
            type="selection"
            width="55">
            </el-table-column>
            <el-table-column
            label="专业代码"
            width="120">
            <template scope="scope">{{ scope.row.date }}</template>
            </el-table-column>
            <el-table-column
            prop="name"
            label="专业名称"
            width="120">
            </el-table-column>
            <el-table-column
            prop="address"
            label="学年"
            show-overflow-tooltip>
            </el-table-column>
            <el-table-column
            prop="name"
            label="专业简称"
            width="120">
            </el-table-column>
            <el-table-column
            prop="name"
            label="学科门类"
            width="120">
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
    export default{
        name:'studentManage',
        data(){
            return {
                studentManageForm:{
                    region:'',
                    year:''
                },
                 tableData3: [{
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-02',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-08',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-06',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    date: '2016-05-07',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }],
                multipleSelection: []

            }
        },
        component:{

        },
        methods:{
            handleSelectionChange(val) {
                this.multipleSelection = val;
            }
        }
    }
</script>
<style>

</style>